 <ui:component xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:rich="http://richfaces.org/rich"
    xmlns:a4j="http://richfaces.org/a4j"
    xmlns:c="http://java.sun.com/jsp/jstl/core"
    xmlns:c2="http://java.sun.com/jsp/jstl/core"
    xmlns:rss4jsf="http://hexiao.cn/rss4jsf">
    
    <h:outputStylesheet>
        .rf-ac {
            width: 300px;
        }

        .rf-ac-itm-c {
            height: 220px;
        }
    </h:outputStylesheet>
    
<h:form>	
		
<rich:accordion  switchType="ajax" activeItem="#{opcioPanelBar.item}" itemChangeListener="#{opcioPanelBar.itemChangeActionListener}" >

<!--  WIZARDS RECURSIU -->
	<rich:accordionItem header="Wizards" name="wizard">								
		<ui:include src="/arbres/arbreRecursiuWizards.xhtml"/>	
	 </rich:accordionItem>

<!--  DOCUMENTS -->
	<rich:accordionItem header="Documentos" name="document">
		<ui:include src="/arbres/arbreRecursiuDocuments.xhtml"/>
 	</rich:accordionItem>
			 
    <!--  BLOGS -->
	<rich:accordionItem header="Blogs" name="blog">
				
		<a4j:ajax event="onenter" action="#{opcioaccordion.activarOpcio}" >
	   		<f:param name="opcio" value="2" />
		</a4j:ajax>
				
		<c2:forEach var="blog" items="#{blogs.items}">
					
			<a4j:commandLink id="cmlBlogs#{blog.id}" actionListener="#{blogs.processAction}" execute="@this"
				styleClass="enllac" render="contingutaccordions,myDiv,queFem">
				<f:attribute name="quinBlog" value="#{blog.id}" />
				<f:attribute name="accio" value="visualitzar" />
								
				<img border="0" src="http://img860.imageshack.us/img860/192/rss2.png" id="hidelink_#{blog.id}" />
								
		   	</a4j:commandLink>
					   	
			<a4j:commandLink id="cmlBlogsCerca#{blog.id}" actionListener="#{blogs.processAction}" 
				styleClass="enllac" render="contingutaccordions,myDiv,queFem">
				<f:attribute name="quinBlog" value="#{blog.id}" />
				<f:attribute name="accio" value="cerca" />
				<img border="0" src="http://img717.imageshack.us/img717/7735/lupah.png" id="hidelinkC_#{blog.id}" />
								
		   	</a4j:commandLink>	
		   	<h:outputText value=" #{blog.descripcio}" escape="false" styleClass="enllac"/>				   	
		   	<br/>
		</c2:forEach>
					
	</rich:accordionItem>
				
				
	 <!--  WHITE PAPERS = EINA DE MARKETING PER COMUNICAR
	 ELS BENEFICIUS D'UN PRODUCTE O TECNOLOGIA  -->
	<rich:accordionItem header="White Papers" name="quart">
				
		<a4j:ajax event="onenter" action="#{opcioaccordion.activarOpcio}" >
	   		<f:param name="opcio" value="3" />
		</a4j:ajax>
	
	 </rich:accordionItem>
			 
	 <!--  CASE STUDIES -->
		
			 
			 
	<!--  WEBINAR = SEMINARI WEB, CONFERENCIA DE PRENSA -->
		
			 
	<!--  PRESENTATIONS -->
	 
			 
				 
	<!--  Forums -->
								 
				
				 
	<!--  Datasheets documento que resume el funcionamiento y otras características de un producto -->
	<rich:accordionItem header="Datasheets" name="cinque">
			
		<a4j:ajax event="onenter" action="#{opcioaccordion.activarOpcio}" >
	   		<f:param name="opcio" value="4" />
		</a4j:ajax>
	
	 </rich:accordionItem>
			 
 </rich:accordion>

</h:form>
</ui:component>
